<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Demo</title>
<meta name="description" content="" />
<meta name="viewport" content="width=device-width" />
<base href="/" />
<link rel="stylesheet" type="text/css"
    href="/webjars/bootstrap/css/bootstrap.min.css" />
<script type="text/javascript" src="/webjars/jquery/jquery.min.js"></script>
<script type="text/javascript"
    src="/webjars/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
    <h1>Login</h1>
    <div class="container text-danger error"></div>
    <div class="container unauthenticated">
        With GitHub: <a href="/oauth2/authorization/github">click here</a>
    </div>
    <div class="container unauthenticated">
        With Google: <a href="/oauth2/authorization/google">click here</a>
    </div>
    <div class="container authenticated" style="display: none">
        Logged in as: <span id="user"></span>
        <div>
            <button onClick="logout()" class="btn btn-primary">Logout</button>
        </div>
    </div>
    <script type="text/javascript" src="/webjars/js-cookie/js.cookie.js"></script>
    <script type="text/javascript">
          $.ajaxSetup({
            beforeSend : function(xhr, settings) {
              if (settings.type == 'POST' || settings.type == 'PUT'
                  || settings.type == 'DELETE') {
                if (!(/^http:.*/.test(settings.url) || /^https:.*/
                    .test(settings.url))) {
                  // Only send the token to relative URLs i.e. locally.
                  xhr.setRequestHeader("X-XSRF-TOKEN", Cookies
                      .get('XSRF-TOKEN'));
                }
              }
            }
          });
          $.get("/user", function(data) {
              $("#user").html(data.name);
              $(".unauthenticated").hide();
              $(".authenticated").show();
          });
          $.get("/error", function(data) {
             if (data) {
                 $(".error").html(data);
             } else {
                 $(".error").html('');
             }
          });
          var logout = function() {
            $.post("/logout", function() {
              $("#user").html('');
              $(".unauthenticated").show();
              $(".authenticated").hide();
            });
            return true;
          }
        </script>
</body>
</html>